<style>
    [v-cloak] {
        display: none;
    }
</style>
<div class="create-rental create-rental-hook">
    <div class="title">
        当前位置：租单管理&nbsp;->&nbsp;托盘租赁&nbsp;->&nbsp;<span class="active">租单新增</span>
    </div>
    <form class="form-horizontal client-create-rental-hook" method="post">
    <div class="order_operation_btn fr">
        <button class="primary_btn">提交订单</button>
        <a class="primary_btn fr" @click.stop="cancleBack()">返回</a>
    </div>
    <div class="inner-wrapper">
        <input type="hidden" value="<%=user.companyType%>" id="userType">
            <ul class="detail_contain">
                <li>
                    <h3>订单信息</h3>
                    <ol class="detail_list">
                        <li  v-cloak>
                            <p  v-cloak><span>客户名称</span>
                                <select class="select_customer" name="selectCustomer" id="select_customer" v-model="info.customerName" @change="changeCustomer" v-if="<%=user.companyType%> === -1 "  v-cloak>
                                    <option v-for="item in items" v-bind:value="item.value" v-cloak>{{item.text}}</option>
                                </select>
                                <input type="text" name="customerAddress" readonly="readonly" value="<%=user.companyName==null?'':user.companyName%>" id="customerName" v-else style="text-align: center">
                            </p>
                            <p>
                                <span>客户地址：</span>
                                <input type="text" name="customerAddress" readonly="readonly" id="customer_address" v-model="info.customerAddress" v-if="<%=user.companyType%> === -1 ">
                                <input type="text"  readonly="readonly" name="customerAddress"  value="<%=user.linkmanAddress==null?'':user.linkmanAddress%>"  id="customerAddress"  v-else  >
                            </p>
                            <p>
                                <span>联系电话：</span>
                                <input type="text" name="customerPhone" readonly="readonly" id="customer_phone" v-model="info.customerPhone" v-if="<%=user.companyType%> === -1 ">
                                <input type="text"  readonly="readonly"  name="customerPhone" value="<%=user.linkmanPhone==null?'':user.linkmanPhone%>" id="customerPhone"  v-else >
                            </p>
                        </li>
                    </ol>
                </li>
                <li>
                    <div class="rent_info noline">
                        <ol class="detail_list">
                            <li>
                                <h4>塑料托盘</h4>
                                <p><span>数量：</span><input type="text"  v-model="info.palletTypesNum" class="input_xs" name="palletTypesNum" @change.stop="changeVal"></p>
                                <p><span>租金：</span><i v-cloak>{{palletTypesRentMoney | formatPrice}}</i></p>
                                <p><span>保证金：</span><i v-cloak>{{palletTypesCautionMoney | formatPrice}}</i></p>
                            </li>
                        </ol>
                    </div>
                    <div class="price_info">
                        <ol class="detail_list">
                            <li v-cloak>
                                <h4 class="diy_btn" @click.stop="priceReview" id="priceReview">费用预估</h4>
                            </li>
                            <li v-cloak>
                                <span>费用总计:</span>
                                <p v-cloak>{{totalCosts | formatPrice}}</p>
                            </li>
                        </ol>
                    </div>
                </li>
            <li>
                <div class="rent_info time_info noline">
                    <ol class="detail_list">
                        <li>
                            <h4>租赁时间</h4>
                            <div class="form_group">
                                <div class="date_group">
                                    <input  type="text" id="datetimeStart" v-model="info.leaseStartDate" name="leaseStartDate" />
                                    <span class="add-on"></span>
                                </div>
                                <label class="time_label">至</label>
                                <div class="date_group">
                                    <input type="text" id="datetimeEnd"  v-model="info.leaseEndDate" name="leaseEndDate" readonly="readonly"/>
                                    <span class="add-on"></span>
                                </div>
                            </div>
                      </li>
                        <li style="margin-top: 20px;">
                            <h4>取货方式</h4>
                            <div class="mode_btn get_type" style="margin: 0;">
                                <label for="" class="diybtn active">上门自取
                                    <input type="radio"  name="pickupMode" value="1" @click="info.pickupMode = 1" :checked="info.pickupMode === 1" >
                                </label>
                                <label for="" class="diybtn">送货上门
                                    <input type="radio"  name="pickupMode" value="2" @click="info.pickupMode =2" :checked="info.pickupMode === 2" >
                                </label>
                            </div>
                        </li>
                        <li style="margin-top: 20px;">
                            <h4>目的地</h4>
                            <div id="rental-map"></div>
                            <div class="address_input">
                                <input type="text" name="pickupAddress1" placeholder="目的地地址" v-model="info.pickupAddress1" autocomplete="off" id="pickupAddress" style="width:300px;">
                                <input type="hidden" name="pickupAddress"  v-model="info.pickupAddress" >
                                <ul class="address_list" id="pickupAddress_list">
                                  <!--  <li v-for="item in list" @click="addressSelected(item)">{{item.address}}</li>-->
                                </ul>
                            </div>
                       </li>
                        <li style="margin-top: 20px;">
                            <h4>备注信息</h4>
                            <textarea v-model="info.remark" name="remark" class="form_control" maxlength="500" placeholder="请输入备注，最大500字"></textarea>
                        </li>
                        <li>
                            <h4>付费方式</h4>
                            <ol class="pay_info">
                                <li>
                                    <h5><label for="">
                                        <input type="radio"  name="paymentMethod" value="1"
                                               @click="info.paymentMethod = 1"
                                               :checked="info.paymentMethod === 1" >
                                        1.银行转账</label>
                                    </h5>
                                    <!-- <p>开户行：XXXX银行</p>
                                     <p>开户名：XXX</p>
                                     <p>银行账户：1234567899</p>-->
                                </li>
                                <li>
                                    <h5>
                                        <label for="">
                                            <input type="radio" name="paymentMethod" value="2" @click="info.paymentMethod = 2" :checked="info.paymentMethod === 2" >2.微信转账
                                        </label>
                                    </h5>
                                    <!--  <span class="account_img"></span>-->
                                </li>
                                <li>
                                    <h5>
                                        <label for="">
                                            <input type="radio"  name="paymentMethod" value="3" @click="info.paymentMethod = 3" :checked="info.paymentMethod === 3" >3.支付宝转账
                                        </label>
                                    </h5>
                                </li>
                            </ol>
                        </li>
                    </ol>
                </div>
                <div class="price_info">
                    <ol class="detail_list">
                    </ol>
                </div>
              </li>
            </ul>
          </div>
     </form>
    </div>
<script type="text/javascript" src="js/back/rent/rental/client-create-rental.js" custom></script>